.home {
    .search {
        @apply w-full h-30 mb-10 bg-red-50 relative;

        .opt {
            left: 50%;
            transform: translateX(-50%);
            @apply h-10 w-2/3 absolute bg-white -bottom-5;
            @apply rounded-md shadow-md;
            @apply flex items-center text-sm;

            & input {
                @apply flex-1 h-full bg-transparent text-gray-600;
            }
        }
    }

    .place {
        .place-item {
            @apply bg-white flex-shrink-0 mx-3 rounded shadow relative overflow-hidden;

            & img {
                @apply w-30 h-30;
            }

            .name {
                transform: translate(-50%, -50%);
                @apply absolute top-1/2 left-1/2 text-white font-bold text-xl;
            }
        }
    }

    .trend-item {
        @apply flex bg-white shadow-md rounded-md p-3 text-sm;

        & > .img {
            @apply w-26 rounded overflow-hidden mr-3;

            & > img {
                width: 100%;
                height: 100%;
            }
        }

        &:not(:last-child) {
            @apply my-3;
        }
    }
}
